<template>
  <el-dialog
    :title="title"
    :close-on-click-modal="false"
    :visible.sync="visible"
    width="900px"
  >
    <el-row :gutter="30">
      <el-col :span="9">
        <el-input
          placeholder="输入老师姓名"
          v-model="value"
          size="small"
          style="100%"
          class="teacher"
        ></el-input>
        <div class="teacher-list">
          <el-radio-group
            v-model="tutor_id"
            size="small"
            @change="getCourseData()"
          >
            <el-radio
              v-for="item in teacherList"
              :label="item.id"
              :key="item.id"
            >
              <span style="display:inline-block;width:100px">{{
                item.label
              }}</span>
              <span style="display:inline-block;width:60px">{{
                item.grade
              }}</span>
              <span style="display:inline-block;width:100px">{{
                item.num
              }}</span>
            </el-radio>
          </el-radio-group>
        </div>
      </el-col>
      <el-col :span="15" class="center">
        <el-radio-group
          v-model="tabStatus"
          size="small"
          @change="getCourseData()"
        >
          <el-radio-button label="0,1">进行中的课程</el-radio-button>
          <el-radio-button label="2">已完成的课程</el-radio-button>
        </el-radio-group>
        <el-table
          :data="courseList"
          :span-method="objectSpanMethod"
          class="margin-top5 el-course-table"
          header-cell-class-name="thead"
        >
          <el-table-column
            v-for="(col, index) in table"
            :prop="col.prop"
            :label="col.label"
            :formatter="col.formatter"
            :width="col.width"
            :key="index"
          ></el-table-column>
        </el-table>
        <el-pagination
          background
          @current-change="handleCurrentChange"
          @size-change="handleSizeChange"
          :current-page="page.pageNum"
          :page-size="page.pageSize"
          layout="total,sizes,prev, pager, next,jumper"
          :total="total"
        >
        </el-pagination>
      </el-col>
    </el-row>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false" size="small">取消</el-button>
      <el-button
        type="primary"
        @click="dataFormSubmit"
        size="small"
        v-preventReClick
        >确定</el-button
      >
    </span>
  </el-dialog>
</template>

<script>
import { cascadeQuery } from "@/api/api.js";
import { changeTutor } from "@/api/user";
import base from "@/views/base.vue";
import { myEnumsMixins } from "@/utils/mixins";
export default {
  props: {
    multipleSelection: {
      type: Array,
      default: []
    },
    mode: {
      type: String,
      default: ""
    }
  },
  mixins: [myEnumsMixins],
  extends: base,
  data() {
    return {
      visible: false,
      spanArr: [1],
      title: "",
      pos: 0,
      total: 0,
      page: {
        pageNum: 1,
        pageSize: 10
      },
      tutor_id: "",
      user_id: "",
      teacherList: [],
      value: "",
      tabStatus: "0,1",
      courseList: [],
      table: [
        {
          label: "课程名称",
          prop: "course_name"
        },
        {
          label: "期次",
          prop: "period",
          width: "50"
        },
        {
          label: "上课时间",
          prop: "time",
          width: "200"
        },
        {
          label: "学生数量",
          prop: "student_number",
          width: "100"
        }
      ]
    };
  },
  methods: {
    init(row) {
      this.visible = true;
      this.getAllAutor(row);
      if (row) {
        this.title = "分配辅导老师";
      } else {
        this.title = "批量分配辅导老师";
      }
    },
    onSubmit() {
      this.page.pageNum = 1;
      this.getAllAutor();
    },
    async getCourseData() {
      if (this.tutor_id) {
        let res = await cascadeQuery({
          table_name: "nice_period_tutor",
          condition: {
            "nice_period_tutor_nice_course_period.course_status": [
              { in: this.tabStatus }
            ],
            tutor_id: this.tutor_id
          },
          by_order: "create_time desc",
          member: "course_name,student_number,period_name_time",
          by_page: { currPage: this.page.pageNum, pageSize: this.page.pageSize }
        });
        if (res[0]) {
        }
        let data = res[1];
        if (data && data.code === 0) {
          this.courseList = [];
          this.total = data.data.totalCount;
          data.data.list &&
            data.data.list.forEach(ele => {
              let period = ele.period_name_time.split(";");
              ele.period = period[0];
              let date =
                period[1].substring(0, 10) + "-" + period[2].substring(0, 10);
              let week = "";
              JSON.parse(period[3]).forEach(item => {
                let time =
                  "每周" +
                  this.$convertNum(item.day_of_Week) +
                  " " +
                  item.start_time.substring(0, 5) +
                  "-" +
                  item.end_time.substring(0, 5);
                week = week + "\r\n" + time;
              });
              ele.time = date + week;
            });
          this.courseList = data.data.list.map(item => {
            return {
              course_name: item.course_name,
              period: item.period,
              student_number: item.student_number + "人",
              time: item.time,
              course_id: item.course_id
            };
          });
          this.pos = 0;
          this.getSpanArr(this.courseList);
        } else {
          this.$message.error(data.msg);
        }
      }
    },
    async getAllAutor(row) {
      let res = await cascadeQuery({
        table_name: "nice_user_base",
        condition: [
          {
            user_type: [
              {
                "=": "4"
              }
            ]
          },
          {
            real_name: [{ like: this.value }]
          }
        ],
        member: "student_number"
      });
      if (res[0]) {
        return;
      }
      let data = res[1];
      if (data && data.code === 0) {
        this.teacherList = [];
        this.tutor_id = "";
        this.courseList = [];
        this.total = 0;
        if (data.data && data.data.length) {
          this.teacherList = data.data.map(ele => {
            return {
              label: ele.real_name,
              grade: this.$filterEnums(
                ele.speaker_grade,
                this.selectEnums.nice_course.grade
              ),
              num: ele.student_number + "学生",
              id: ele.sys_user_id
            };
          });
          if (row) {
            this.tutor_id = row.tutor_id
              ? row.tutor_id
              : this.teacherList[0].id;
            this.user_id = row.student_id || 0;
          } else {
            this.tutor_id = this.teacherList[0].id;
          }
          this.getCourseData();
        }
      } else {
        this.$message.error(res[1].msg);
      }
    },
    getSpanArr(list) {
      this.spanArr = [1];
      list.forEach((ele, index) => {
        if (index > 0) {
          if (list[index].course_id === list[index - 1].course_id) {
            this.spanArr[this.pos] += 1;
            this.spanArr.push(0);
          } else {
            this.spanArr.push(1);
            this.pos = index;
          }
        }
      });
    },
    // 表单提交
    dataFormSubmit() {
      let list = [];
      if (this.mode === "batch") {
        list = this.multipleSelection.map(ele => {
          return {
            student_id: ele.student_id,
            tutorId: this.tutor_id
          };
        });
      } else {
        list = [
          {
            student_id: this.user_id,
            tutorId: this.tutor_id
          }
        ];
      }
      this.submit(list);
    },
    async submit(e) {
      let res = await changeTutor(e);
      if (res[0]) {
        return;
      }
      let data = res[1];
      if (data && data.code === 0) {
        this.$message({
          message: "分配辅导老师成功",
          type: "success",
          duration: 1500,
          onClose: () => {
            this.visible = false;
            this.$emit("refreshDataList");
          }
        });
      } else {
        this.$message.error(data.msg);
      }
    },
    querySearch() {},
    handleCurrentChange(val) {
      this.page.pageNum = val;
      this.getCourseData();
    },
    handleSizeChange(val) {
      this.page.pageSize = val;
      this.getCourseData();
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        return {
          rowspan: this.spanArr[rowIndex],
          colspan: this.spanArr[rowIndex] > 0 ? 1 : 0
        };
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.teacher-list {
  width: 100%;
  height: 450px;
  margin-top: 20px;
  border: 1px solid #ccc;
  padding: 5px;
  overflow-y: auto;
}
.el-radio {
  margin: 6px !important;
  width: 100%;
}
</style>
